<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript">
			function f1() {
				console.log("f11111");
			}
			function f2() {
				console.log("f22222");
			}
			function f3() {
				console.log("f33333");
			}
			
			window.onload = function() {
				var dv = document.getElementsByTagName("div")[0];
				dv.addEventListener("click", function() {
					//this代表div元素节点对象
					dv.style.backgroundColor = "pink";
					this.style.width = "400px";
				});
				dv.addEventListener("click", function() {
					//this代表div元素节点对象
					this.style.height = "400px";
				});
				dv.addEventListener("mousemove", f1);				
				dv.addEventListener("mousemove", f2);				
				dv.addEventListener("mousemove", f3);				
			}
			
			function cancel() {
				var dv = document.getElementsByTagName("div")[0];
				dv.removeEventListener("mousemove", f1);
				dv.removeEventListener("mousemove", f2);
			}
		</script>
	</head>
	<body>
		<div style="width:300px;height: 200px;background-color: red;"></div>
		<input type="button" value="取消" onclick="cancel();"/>
	</body>
</html>
